<template>
  <div class="app-container">
    <el-select
      style=" margin-top: 20px;"
      v-model="userId"
      filterable
      remote
      reserve-keyword
      placeholder="请输入关键字"
      :remote-method="remoteMethod"
      :loading="loading"
    >
      <el-option
        v-for="item in options"
        :key="item.userId"
        :label="'['+item.departmentName+']'+item.userName"
        :value="item.userId"
      ></el-option>
    </el-select>
    <el-row style=" margin-top: 50px;">
      <el-col :offset="10">
        <el-button type="primary" @click="submit">添加</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import Controller from "@/libs/framework/controller";
import request from "@/utils/request";
export default class Instance extends Controller {
  mixin() {
    return {
      data() {
        return {
          applyId: null,
          userId: "",
          options: [],
          loading: false,
        };
      },
      created() {
        this.applyId = this.$attrs.applyId;
        this.userId = this.$attrs.userId;
      },
      methods: {
        close() {
          this.$root.closeModal("/eip/computerApplyAddUser");
        },
        submit() {
          this.$confirm("确定添加使用人吗？", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
            .then(() => {
              request({
                url: "/eip/computer2/updateUserId",
                method: "post",
                data: {
                  userId: this.userId,
                  applyId: this.applyId,
                },
              })
                .then((r) => {
                  if (r.success) {
                    this.$message({
                      type: "success",
                      message: "添加成功!",
                    });
                    this.close();
                  } else {
                    this.$message({
                      type: "error",
                      message: "添加失败!",
                    });
                  }
                })
                .catch((e) => {
                  reject(e);
                });
            })
            .catch(() => {});
        },
        remoteMethod(query) {
          if (query !== "") {
            this.loading = true;
            request({
              url: "/admin/sysRole/setUsers/userSelect2",
              method: "get",
              params: {
                term: query,
              },
            })
              .then((r) => {
                console.log(r);
                this.options = r.data;
                this.loading = false;
              })
              .catch((e) => {
                reject(e);
              });
          } else {
            this.options = [];
          }
        },
      },
    };
  }
}
</script>

<style scoped lang="scss">
</style>

